
{extend name='table'}
{block name="style"}
{if isset($heightstyle)}
{$heightstyle|raw}

{/if}
<style>
    .text-btn{
        color: #1E9FFF;
        margin: 0 5px;
    }
    .x-red{
        color: red;
    }
    .showhides{
        display: none;
    }
    .morediv {
        display: inline-block;
        position: relative;
        cursor: pointer;
    }

    .morediv .merchild {
        display: none;
        position: fixed;
        top: 200px;
        left: 100px;
        z-index: 999;
        background-color: #fff;
        padding: 5px;
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .5);
    }

    .morediv .merchild .text-btn {
        cursor: pointer;
        border-bottom: 1px solid #eee;
    }

    .morediv .merchild .text-btn:last-child {
        border: none;
    }
</style>

{/block}

{block name="button"}

{if !isset($hideButtonAdd) }
<button {if isset($formType) && $formType="open"}data-open='{:url("add")}'{else}data-modal='{:url("add")}'{/if} data-title="添加" class='layui-btn layui-btn-sm layui-btn-primary'>添加</button>
{/if}

{if isset($allBtn)}
{$allBtn|raw}
{/if}
{/block}

{block name="content"}


<div class="layui-tab layui-tab-card">
    <div class="layui-tab-content">
        {if isset($search)}

        <form class="layui-form layui-form-pane form-search" action="{:sysuri()}" onsubmit="return false" method="get" autocomplete="off">

            {foreach $search as $k=>$val}

            <div class="layui-form-item layui-inline {if $k>3}showhides{/if}">
                <label class="layui-form-label">{$val.title}</label>
                {$val.html|raw}
            </div>
            {/foreach}
            {if count($search)>4}
            <div class="layui-form-item layui-inline " style="border: none;">
                <a href="javascript:;" id="moresearch">更多筛选</a>
            </div>
            {/if}
            <div class="layui-form-item layui-inline">
                <button class="layui-btn layui-btn-primary"><i class="layui-icon">&#xe615;</i> {:lang('搜 索')}</button>
                <button type="reset" class="layui-btn layui-btn-primary"><i class="layui-icon">&#x1002;</i> 重置</button>
            </div>
        </form>
        {/if}
        {php}
        if(isset($tableId)){
            $tid = $tableId;
        }else{
            $tid = "listTable";

        }
        {/php}
        <table id="{$tid}"  lay-filter="listTable" data-url="{:sysuri('',input('get.'))}" data-target-search="form.form-search"></table>

    </div>

</div>
<script>
    var util,table
    var showmoresearch = false
    layui.use(['util','table'],function () {
        util = layui.util;
        table = layui.table
        $('#moresearch').on('click',function(){
            if(!showmoresearch){
                $('.showhides').css('display','inline-block')
            }else{
                $('.showhides').css('display','none')
            }
            showmoresearch = !showmoresearch
        })
    })
    function apiFormat(d){
        return util.escape(d.api);
    }
    function htmlspecialchars_decode(str){
        str = str.replace(/&amp;/g, '&');
        str = str.replace(/&lt;/g, '<');
        str = str.replace(/&gt;/g, '>');
        str = str.replace(/&quot;/g, "''");
        str = str.replace(/&#039;/g, "'");
        return str;
    }

    var cols = new Array()
</script>

{foreach $tableHeader as $val}


{if isset($val.ischeckbox)}
<script>

    var item = {
        type:'checkbox'
    }
</script>
{else}

<script>

    var item = {
        field:'{$val.field}',
        title:'{$val.title}',
    }
</script>
{/if}
{if isset($val.width)}
<script>
    item['width'] = parseInt('{$val.width}');
</script>
{/if}
{if isset($val['templet'])}
<script>
    item['templet'] = {$val['templet']|raw};
</script>
{/if}
{if isset($val['isedit'])}
<script>
    item['templet'] = "#inputTpl"
</script>
{/if}
<script>
    cols.push(item)
</script>
{if isset($val['templet'])}
{if isset($val['templetType'])}
    {if $val['templetType'] == 'img'}
<script type="text/html" id="{:str_replace(["'#","'"],"",$val['templet'])}">
    {{# if(d.img){ }}
    <div><a target="_blank" data-tips-hover data-tips-image="{{d.img}}"><img src="{{d.img}}" height="60" alt=""></a></div>

    {{# }else{ }}
        -
    {{# } }}
</script>
{elseif $val['templetType'] == 'StatusSwitchTpl'}
    <script type="text/html" id="{:str_replace(["'#","'"],"",$val['templet'])}">
        <input type="checkbox" value="{{d.id}}"  lay-skin="switch" lay-text="{:lang('开启')}|{:lang('停止')}" lay-filter="StatusSwitch" {{-d.status>0?'checked':''}}>

    </script>

{/if}


{/if}

{/if}
{/foreach}
<script type="text/html" id="inputTpl">
    <input type="text"  data-action-blur="{:sysuri('editField')}" data-value="id#{{d.id}};field#{value}" data-loading="false" value="{{d.edit}}" class="layui-input text-center">
</script>
<script type="text/html" id="{$tid}toolbar">
    {if !isset($hideButtonAdd) }
    <a class="text-btn " data-event-dbclick data-title="{:lang('编辑')}" {if isset($formType) && $formType="open"}data-open='{:url("edit")}?id={{d.id}}'{else}data-modal='{:url("edit")}?id={{d.id}}'{/if}>{:lang('编 辑')}</a>
    {/if}
    {if !isset($hideButtonDel) }
    <a class="text-btn  x-red" data-confirm="{:lang('确定要永久删除吗？')}" data-action="{:url('remove')}" data-value="id#{{d.id}}">{:lang('删 除')}</a>
    {/if}
    {if isset($button_list)}
    {$button_list|raw}
    {/if}
</script>
{if $actionminwidth != 'none'}
<script>
    cols.push({toolbar: '#{$tid}toolbar', title: '{:lang("操作面板")}', align: 'center', minWidth: '{$actionminwidth}', fixed: 'right'})

</script>
{/if}
{if isset($tableHeight) && $tableHeight}
<script>
    var tableHeight = "{$tableHeight}";
</script>
{else}
<script>
    var tableHeight = "full";
</script>
{/if}
{if isset($script)}
{$script|raw}
{/if}
<script>

    var tableIns
    $(function () {
        tableIns = $('#{$tid}').layTable({
            even: true,
            height: tableHeight,
            toolbar:true,
            sort:{},
            where:{},
            loading:false,
            cols:[cols],
            done:function (r) {
            }
        })
        


        layui.form.on('edit({$tid})', function(obj){ //注：edit是固定事件名，test是table原始容器的属性 lay-filter="对应的值"
            $.form.load('{:url("editField")}', {
                id:item.data.id,
                field:item.field,
                value:item.value
            }, "post", function (ret) {

            }, null, null, 'false');
        });


        // 数据状态切换操作
        layui.form.on('switch(StatusSwitch)', function (obj) {
            var data = {id: obj.value, value: obj.elem.checked > 0 ? 1 : -1,field:'status'};

            $.form.load('{:url("editStatus")}', data, "post", function (ret) {

            }, null, null, 'false');

        });
    })
    function shuaxin() {

        $.layTable.reload('{$tid}')
    }
    function getchecklist() {

       var i = table.checkStatus('{$tid}')
       return i
    }
    $(function () {
        $('body').on('mouseenter','.morediv',function () {
            var offset = $(this).offset();
            console.log("Top Position: " + offset.top);
            console.log("Left Position: " + offset.left);
            $(this).stop().find('.merchild').css({
                top:(offset.top+25) + 'px',
                left:(offset.left-20) + 'px',
            })
            $(this).stop().find('.merchild').show();
        })
        $('body').on('mouseleave','.morediv',function () {
            $(this).stop().find('.merchild').hide();
        })
        $('.morediv').stop().hover(function () {
            console.log(111)
            $(this).find('.merchild').show();
        },function () {
            $(this).find('.merchild').hide();

        })
    })
</script>
{/block}